import React, { Component } from 'react';
import OptionItem from '../Option/OptionItem'


export default class OptionBar extends Component{
    constructor(props){
        super(props);
        this._click = this.click.bind(this);
        window.now_index=0;
    }

    componentWillMount(){
        this.setState({type:this.props.type});
    }
    componentWillReceiveProps(nextProps){
        if(nextProps.type!=this.props.type){
            this.setState({type:nextProps.type})
        }
    }

    click(obj){
        if (obj.state.select == "true"){
            //传个主页面 选择哪个模块
            this.props.chose(obj.props.index);
        }
    }
    getSelectState(index){
        if (index == this.state.type){
            return "true";
        }else {
            return "false";
        }
    }

    render(){
        return(
            <div>
                {this.props.items.map((item,index)=>{
                      return  (<OptionItem
                            title = {item}
                            isSelected = {this.getSelectState(index)}
                            index={index}
                            key={index}
                            click = {this._click}
                            totalCount = {this.props.items.length}
                            />)
                }

                )}
                <div style={{clear:"both"}} />
            </div>
        )
    }
}

OptionBar.defaultProps = {
    items: ["待支付","未使用","已使用","已过期"],
    type: 0
};

OptionBar.propTypes = {
    chose: React.PropTypes.func,
    items: React.PropTypes.array,
    type: React.PropTypes.number

};